<template>
    <el-card style="margin-top: 20px;">
        <img :src="qrcode" alt="QR Code" />
      </el-card>
</template>
<script setup lang="ts">
import { onMounted, ref,defineProps } from 'vue';

import QRCode from 'qrcode';
import axios from 'axios';


const props = defineProps({
    orderId:{
        type:String,
        required:true
    },
  
})
const qrcode = ref();
const token = ref("");
onMounted(()=>{
   axios.get("/api/orders/pay_order/"+props.orderId).then(res=>{
        token.value = res.data.data;
        QRCode.toDataURL(`http://www.ygxiaobai.top/order_pay/${props.orderId}/${token.value}`)
      .then(url => {
        qrcode.value = url;
      })
      .catch(err => {
        console.error(err);
      });
    })
    
  })
</script>